<template>
  <div class="app">
    <Header>
      <div slot="left" class="left">返回</div>
      <div slot="center" class="center">标题</div>
      <div slot="right" class="right">前进</div>
    </Header>
  </div>
</template>
<script>


import Header from "@/components/Header.vue";

export default {
  name: "App",
  components: {Header},
  data() {
    return {}
  },
};
</script>
<style lang="less">
.app {
  display: flex;
  justify-content: space-around;
}
.left{
  text-align: center;
  width: 60px;
  height: 100%;
  background-color: #DC143C;
}
.center{
  height: 100%;
  text-align: center;
  background-color: cadetblue;
  flex: 1;
}
.right{
  text-align: center;
  width: 60px;
  height: 100%;
  background-color: #f89106;
}
</style>
